'use strict'

define(() => {
    return {
        template: `
            <div class='line clear'>
                <div class='line-label'>
                    <label>管理员</label>
                </div>
                <div class='line-pannel'>
                    <select v-model='goods' @change='handleChange'>
                        <option value='value-1'>用户1</option>
                        <option value='value-2'>用户2</option>
                    </select>
                </div>
            </div>
            <div class='line clear'>
                <div class='line-label'>
                    <label>角色</label>
                </div>
                <div class='line-pannel'>
                    <select v-model='type' @change='handleChange2'>
                        <option value='value-3'>超级管理员</option>
                        <option value='value-4'>普通</option>
                    </select>      
                </div>
            </div>
            
            <button @click='reset' type='reset'>重置</button>      
            <button @click='sumbit' type='submit'>提交</button>
        `,
        data: {
            goods: '', // 商品id
            type: '' // 商品类别
        },
        methods: {
            handleChange(val, label) {
                //alert(`select选中项的val是${ val }，label是${ label }`)
            },
            handleChange2(val, label) {
                //alert(`select选中项的val是${ val }，label是${ label }`)
            },
            sumbit() {
                alert(`提交成功，商品id是${ this.goods }`)
            },
            reset() {
                this.goods = 'value-1'
                this.type = 'value-3'
            }
        }
    }
})